VChart 1.13.0
Tutorials
Contributing
Options
API
FAQ
Themes 🌼
Changelogs
Online Customization
Playground
VChart Story Teller

Not only an out-of-the-box multi-terminal chart library, but also a vivid and flexible data storyteller.

VTable Checkered Artist

Not only a high-performance multi-dimensional data analysis form, but also a grid artist created between rows and columns.

VGrammar Data Magician

It is not only a visual grammar that generates thousands of charts, but also a data magician who turns boring into magic.

VRender Visual Rendering

Not only a visual rendering engine with rich functions, but also a handy pen.

VMind Smart Visualization Suit

Not just automatic, but also fantastic.

VStory Relationship Explorer plus

It is not only a fully functional graph visualization library, but also an explorer of data relationships.

!!!###!!!title=79- How to achieve coordinated display of positions in other charts when moving the mouse in the vchart library——VisActor/VChart FAQ documents!!!###!!!!!!###!!!description=---title: 109. In the vchart library, how to achieve the linkage effect of displaying the position of other charts when the mouse is moved?</br>key words: VisActor,VChart,VTable,VStrory,VMind,VGrammar,VRender,Visualization,Chart,Data,Table,Graph,Gis,LLM--- !!!###!!!

Question title

How to achieve the linkage effect of displaying the position of other charts when the mouse is moved in the vchart library?

Problem description

I encountered a problem when using the vchart library. I hope that when I move the mouse, other charts can also display their corresponding positions at the same time, that is, to achieve the linkage effect. I am not sure how to implement this function. Is there any relevant documentation for my reference?

Solution

This linkage effect can indeed be achieved. You need to listen to the dimensionHover event of a chart and then simulate dimensionHover for other charts.
First, you need to use the on method to listen to the dimensionHover event of the chart. The detailed API usage can be referred to the vchart API .

vChart.on('dimensionHover', function(params) {
// 处理逻辑
});</br>

Then, you can use the setDimensionIndex method to simulate the dimensionHover effect on other charts. Please refer to the vchart API for API details.

vChart.setDimensionIndex(value, {
// options
});</br>

Among them,

  • Value is the dimension value,
  • Options is a DimensionIndexOption type of parameter that can be used to filter the axis to trigger the dimension effect, configure tooltips and crosshairs, etc.

Related Documents